﻿
@{
    ViewBag.Title = "添加博客";
}
@section headSection
{

    @Styles.Render("~/EasyUI/themes/insdep/css")
}
@section scripts
{
    <script src="~/kindeditor/kindeditor-all-min.js"></script>
    <script src="~/kindeditor/lang/zh-CN.js"></script>
    <script>
        function doBegin() {
            $.notifyBox.showNotifyInfo('正在提交数据....');
        }

        function doFail() {
            $.notifyBox.showNotifyErr('网络异常!');
        }

        function doComplete(xhrObj) {
            $.processJsonMsgNotify(xhrObj.responseText, function() {});
        }

        function ajaxAddTag() {
            $.notifyBox.showNotifyInfo('正在添加标签...');
            $.ajax({
                url: '@Url.Content("~/Blogs/Blog/AddTag")',
                type: 'POST',
                data: { TagName: $('#add-tag').val() },
                error: function() {
                    $.notifyBox.showNotifyErr('网络错误!');
                },
                success: function(response) {
                    $.processJsonMsgNotify(response,
                        function() {
                            if (response.Statu === 1) {
                                $('#tags').tagbox('reload');
                                $('#add-tag').textbox('setText', '');
                                $('#addTag').dialog('close');
                            }
                        });
                }
            });
        }

        // 初始化控件
        function initControl() {
            $('#addTag').dialog({
                title: '添加新标签',
                iconCls: 'icon-add',
                shadow: true,
                buttons: [
                    {
                        text: '添加',
                        iconCls: 'icon-ok',
                        handler: function() {
                            ajaxAddTag();
                        }
                    }, {
                        text: '取消',
                        handler: function() {
                            $('#addTag').dialog('close');
                        }
                    }
                ]
            }).dialog('close');
            $('#tags').tagbox({
                hasDownArrow: true,
                limitToList: true,
                valueField: 'id',
                textField: 'text',
                url: '@Url.Content("~/Blogs/Blog/GetTagsCombox")',
                loadFilter: function(data) {
                    return data.Data;
                }
            });
        }

        $().ready(function () {
            initControl();
            // TODO: BUG 表单验证有问题，无法运行
            $('#blog-form').validate({
                rules: {
                    Title: {
                        required: true
                    }
                },
                messages: {
                    Title: {
                        required:'标题不能为空！'
                    }
                },
                onfocusout: false,
                onkeyup: false,
                onclick: false,
                OnSubmit: true,
                errorPlacement: function(error, element) {
                    $.notifyBox.showNotifyErr(error.text());
                }
            });
        });

        //初始化编辑器
        KindEditor.ready(function(K) {
            var options = {
                cssPath: '@Url.Content("~/kindeditor/themes/qq/qq.css")',
                uploadJson: '@Url.Content("~/Media/File/UploadFile")',
                fileManagerJson: '@Url.Content("~/Media/FileManager")',
                resizeType: 1, // 只能改变高度
                allowFileManager: true,
                filterMode: true,
                afterBlur: function() { editor.sync(); },
                afterUpload: function(url, data, name) {
                    console.log(url);
                    console.log(data);
                    console.log(name);
                }
            };
            window.editor = K.create('#Content', options);
            // 弹出缩略图
            K('#form-upimg').click(function() {
                editor.loadPlugin('image', function() {
                    editor.plugin.imageDialog({
                        imageUrl: $('#image').textbox('getValue'),
                        clickFn : function(url) {
                            $('#image').textbox('setValue',url);
                            editor.hideDialog();
                        }
                    });
                });
                return false;
            });
        });
    </script>
}
<div class="title">
    <h3 style="line-height: 1.3">添加博客</h3>
</div>
<div>
    @using (Ajax.BeginForm("AddBlog", new { area = "Blogs", controller = "Blog" }, new AjaxOptions()
    {
        HttpMethod = "post",
        OnBegin = "doBegin",
        OnFailure = "doFail",
        OnComplete = "doComplete"
    }, new { id = "blog-form", name = "blog-form" }))
    {
        <label>标题：</label><br /><input class="easyui-textbox" id="Title" name="Title" style="width: 95%; height: 30px"><br />
        <label>标签：</label><br /><input id="tags" name="Tags" style="width: 70%; height: 30px"><button style="margin-left:10px" onclick="javascript: $('#addTag').dialog('center').dialog('open'); return false;" class="badge color-grayish">+</button><br />
        <label>缩略图(可空)：</label><br /><input id="image" name="Image" class="easyui-textbox" style="width: 70%;height: 30px" /><button id="form-upimg" style="margin-left:10px" class="badge color-grayish">上传图片</button><br />
        <label>摘要：</label><br /><input class="easyui-textbox" data-options="multiline:true" id="Summary" name="Summary" style="width: 95%; height: 80px"><br />
        <label>内容：</label><br /><input id="Content" data-options="multiline:true" name="Content" style="width: 95%; height: 500px"><br />
        <label>验证码:</label><br /><input class="easyui-textbox" type="text" id="validateCode" name="validateCode" value="" style="margin: 10px" /><img src="@Url.Content("~/ValidateCode.ashx")" alt="看不清，换一个？" onclick="this.src = this.src + '?'" style="margin: 10px" /><br>
        <input type="submit" class="easyui-linkbutton button-blue l-btn l-btn-small" name="submit" style="width: 46px; height: 30px; margin: 10px" value="提交" />
        <input type="reset" class="easyui-linkbutton button-red l-btn l-btn-small" style="width: 46px; height: 30px; margin: 10px" name="reset" value="重置" />
    }
</div>
<div id="addTag" style="width:300px;height:150px; padding: 10px;display: none">
    <input type="text" id="add-tag" class="easyui-textbox" style="margin: 10px; width: 100%; height: 30px">
</div>

